<template>
  <div class="afooter">
    <div class="afooter_inner">
      <!-- 顶部 -->
      <div class="afooter_top">
        <div class="afooter_top_logo"></div>
        <h6 v-text="lang.h6Text"></h6>
        <a :href="aUrl" v-text="lang.aText"></a>
        <div class="afooter_copy">
          <a 
            v-for="(item, index) in cpList" 
            :key="index"
            :href="item.url" 
            v-text="lang.cpList[index].text"
          ></a>
        </div>
        <div class="line"></div>
      </div>

      <!-- 友情链接 -->
      <ul class="afooter_friend_url" :class="{afooter_friend_url__en: langKey == 'en'}">
        <li 
          v-for="(item, index) in friendUrlList"
          :key="index"

        ><a href="item.url" v-text="lang.friendUrlList[index].text"></a></li>
      </ul>
      <!-- 版权所有 -->
      <p class="copyright" v-text="lang.copyrightText"></p>
    </div>
  </div>
</template>

<script>

export default {
  props: {
    lang: {
      type: Object,
    },
    langKey: String,
  },
  data () {
    return {
      h6Text: 'IDCG集团',
      aText: 'www.idcg.io',
      aUrl: '//www.idcg.io',
      cpList: [
        { text: '服务条款', url: '/help/termsOfUse', },
        { text: '隐私协议', url: '/help/privacyPolicy', }
      ],
      friendUrlList: [
        { url: '//www.idcg.io', text: 'IDCM全球混合去中心化交易所联盟', },
        { url: '//www.idcm.io', text: 'IDCM国际数字资产交易所', },
        { url: '//www.idcw.io', text: 'IDCW国际数字资产钱包', },
        { url: '//www.idcr.io', text: 'IDCR冰点研究院', },
        { url: '//www.idcam.io', text: 'IDCAM国际数字资产管理', },
        { url: 'javascript:;', text: '', },
      ],
      copyrightText: '@ 2018 IDC Group ALl Rights Reserved.'
    }
  },
  methods: {

  },
  mounted () {

  }
}
</script>

<style lang="stylus">
.afooter 
  height: 406px;
  background-color: #081336;
  .afooter_inner
    width: 1200px;
    margin: 0 auto;
    .afooter_top
      padding-top: 70px;
      color: #fff;
      text-align: center;
      .afooter_top_logo
        width: 45px;
        height: 50px;
        margin:  0 auto 15px;
        background: url(../images/it_footer_logo.svg) no-repeat center top;
      h6
        margin-bottom: 4px;
        line-height: 24px;
        font-size: 18px;
      &>a
        display block
        margin-bottom: 20px;
        line-height: 24px;
        font-size: 14px;
        color #fff
      .afooter_copy
        margin-bottom: 20px;
        &>a
          display: inline-block;
          margin: 0 24px;
          font-size: 14px;
          line-height: 20px;
      .line
        height: 1px;
        margin-bottom: 20px;
        background: #576182;
    .afooter_friend_url
      text-align: center;
      margin-bottom: 20px;
      &.afooter_friend_url__en
        &>li
          width: 360px;
      &>li
        display: inline-block;
        width: 317px;
        text-align: left;
        margin-bottom: 20px;
        &>a
          display: inline-block;
          line-height: 20px;
          font-size: 14px;
    &>p
      text-align: center;
      margin-bottom: 20px;
      line-height: 18px;
      font-size: 12px;
      color: #576182;
    a 
      color: #707B9E;
      &:hover
        opacity: 0.8;
        // color: #fff;
        color: #3782FF;
        transition: color 0.3s;
      


</style>
